<template>
  <div>
    <div>当前积分 ---> {{ user.integration }}</div>

    <div class="shop-container">
      <Shopitem
        v-for="item in shopList"
        :key="item._id"
        :item="item"
      />
    </div>
  </div>
</template>

<script>
import { mapState } from 'vuex';

// 组件
import Shopitem from '@/views/mall/component/Shopitem.vue';

export default {
  name: 'Mall',
  components: { Shopitem },
  data() {
    return {
      shopList: [],
    };
  },
  computed: {
    ...mapState({
      user: (state) => state.user.user,
    }),
  },
  created() {
    this.loadShopList();
  },
  methods: {
    async loadShopList() {
      const result = await this.$request({
        url: '/api/shop/shopList',
        method: 'get',
      });
      this.shopList = result.list;
    },
  },
};
</script>

<style scoped>
.shop-container {
  display: flex;
}
</style>
